<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no">

	<title>Online 3D Viewer</title>

    <script type="text/javascript" src="../../libs/three.min-129.js"></script>

	<!-- engine start -->
	<script type="text/javascript" src="../source/core/core.js"></script>
	<script type="text/javascript" src="../source/core/taskrunner.js"></script>
	<script type="text/javascript" src="../source/geometry/geometry.js"></script>
	<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
	<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
	<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
	<script type="text/javascript" src="../source/geometry/box3d.js"></script>
	<script type="text/javascript" src="../source/geometry/octree.js"></script>
	<script type="text/javascript" src="../source/geometry/matrix.js"></script>
	<script type="text/javascript" src="../source/geometry/transformation.js"></script>
	<script type="text/javascript" src="../source/geometry/tween.js"></script>
	<script type="text/javascript" src="../source/io/binaryreader.js"></script>
	<script type="text/javascript" src="../source/io/binarywriter.js"></script>
	<script type="text/javascript" src="../source/io/textwriter.js"></script>
	<script type="text/javascript" src="../source/io/bufferutils.js"></script>
	<script type="text/javascript" src="../source/io/fileutils.js"></script>
	<script type="text/javascript" src="../source/io/externallibs.js"></script>
	<script type="text/javascript" src="../source/model/material.js"></script>
	<script type="text/javascript" src="../source/model/triangle.js"></script>
	<script type="text/javascript" src="../source/model/property.js"></script>
	<script type="text/javascript" src="../source/model/element.js"></script>
	<script type="text/javascript" src="../source/model/mesh.js"></script>
	<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
	<script type="text/javascript" src="../source/model/node.js"></script>
	<script type="text/javascript" src="../source/model/model.js"></script>
	<script type="text/javascript" src="../source/model/topology.js"></script>
	<script type="text/javascript" src="../source/model/modelutils.js"></script>
	<script type="text/javascript" src="../source/model/modelfinalization.js"></script>
	<script type="text/javascript" src="../source/model/quantities.js"></script>
	<script type="text/javascript" src="../source/model/generator.js"></script>
	<script type="text/javascript" src="../source/import/importerutils.js"></script>
	<script type="text/javascript" src="../source/import/importerbase.js"></script>
	<script type="text/javascript" src="../source/import/importerobj.js"></script>
	<script type="text/javascript" src="../source/import/importerstl.js"></script>
	<script type="text/javascript" src="../source/import/importeroff.js"></script>
	<script type="text/javascript" src="../source/import/importerply.js"></script>
	<script type="text/javascript" src="../source/import/importer3ds.js"></script>
	<script type="text/javascript" src="../source/import/importergltf.js"></script>
	<script type="text/javascript" src="../source/import/importero3dv.js"></script>
	<script type="text/javascript" src="../source/import/importerthree.js"></script>
	<script type="text/javascript" src="../source/import/importer3dm.js"></script>
	<script type="text/javascript" src="../source/import/importerifc.js"></script>
	<script type="text/javascript" src="../source/import/filelist.js"></script>
	<script type="text/javascript" src="../source/import/importer.js"></script>
	<script type="text/javascript" src="../source/export/exporterbase.js"></script>
	<script type="text/javascript" src="../source/export/exporterobj.js"></script>
	<script type="text/javascript" src="../source/export/exporterstl.js"></script>
	<script type="text/javascript" src="../source/export/exporterply.js"></script>
	<script type="text/javascript" src="../source/export/exporteroff.js"></script>
	<script type="text/javascript" src="../source/export/exportergltf.js"></script>
	<script type="text/javascript" src="../source/export/exporter3dm.js"></script>
	<script type="text/javascript" src="../source/export/exporter.js"></script>
	<script type="text/javascript" src="../source/threejs/threeutils.js"></script>
	<script type="text/javascript" src="../source/threejs/threeconverter.js"></script>
	<script type="text/javascript" src="../source/threejs/threemodelloader.js"></script>
	<script type="text/javascript" src="../source/parameters/parameterlist.js"></script>
	<script type="text/javascript" src="../source/viewer/domutils.js"></script>
	<script type="text/javascript" src="../source/viewer/navigation.js"></script>
	<script type="text/javascript" src="../source/viewer/viewer.js"></script>
	<script type="text/javascript" src="../source/viewer/domviewer.js"></script>
	<!-- engine end -->

    <script type='text/javascript'>
        OV.Init3DViewerElements (function (viewers) {
			let firstViewer = viewers[0].viewer;
			firstViewer.SetBackgroundColor (new OV.Color (34, 34, 34));
		});
    </script>

    <style>
        div.online_3d_viewer
        {
            float: left;
            border: 1px solid #eeeeee;
            margin: 0px 4px 4px 0px;
        }
    </style>
</head>

<body>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/3ds/cube_four_instances.3ds,../../test/testfiles/3ds/texture.png">
    </div>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/obj/hundred_cubes.obj,../../test/testfiles/obj/hundred_cubes.mtl">
    </div>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/obj/hundred_cubes.obj,../../test/testfiles/obj/not_exising.mtl,../../test/testfiles/obj/hundred_cubes.mtl">
    </div>	
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/3ds/cube_four_instances.3ds,../../test/testfiles/3ds/texture.png"
        camera="3.929421317669367,6.153966358575169,2.7076091223424714,1.5,1.5,0.5,0,0,1">
    </div>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/obj/hundred_cubes.obj,../../test/testfiles/obj/hundred_cubes.mtl"
        camera="1,1,1,0,0,0,0,0,1">
    </div>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/obj/hundred_cubes.obj">
    </div>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="../../test/testfiles/obj/hundred_cubes.obj"
        defaultcolor="200,0,0"
		backgroundcolor="200,200,200">
    </div>
    <div class="online_3d_viewer"
		style="width: 360px; height: 240px;"
        model="wrong.3ds">
    </div>
</body>

</html>
